<template>
    <ui-main>
        <div class="ui-title" style="color: #0F9ADC;">举报信息</div>
        <van-cell-group >
            <van-field v-model="form.to_report_enterprise" label="被举报单位" required placeholder="请输入被举报单位" />
            <van-field v-model="form.report_person" label="举报人姓名" required placeholder="请输入举报人姓名" />
            <van-field v-model="form.email" label="举报人邮箱" placeholder="请输入举报人邮箱" />
            <van-field v-model="form.report_phone" label="举报人电话 " placeholder="请输入举报人电话 " required />
            <van-cell title="举报时间" is-link :value="form.report_time" required @click="showDate()" class="w-100" />
            <van-cell title="选择类型" is-link :value="type" required @click="showType()" class="w-100" />
        </van-cell-group>

        <van-cell-group class="mt10">
            <van-field v-model="form.report_title" label="标题" required placeholder="请输入标题" />
            <van-field v-model="form.report_content" label="举报内容" type="textarea" :autosize="bigText" required placeholder="请输入举报内容" />
        </van-cell-group>

        <van-popup v-model="datePop" position="bottom">
            <van-datetime-picker v-model="currentDate" type="datetime" :min-date="minDate" :max-date="maxDate" @cancel="onDateCancel" @confirm="onDateConfirm"  />
        </van-popup>


        <van-popup v-model="typePop" position="bottom">
            <van-picker show-toolbar title="选择类型" :columns="types" @cancel="onCancel" @confirm="onConfirm" />
        </van-popup>

        <van-button square slot="footer" size="large" type="primary" @click="sumitItem()">提交</van-button>
    </ui-main>
</template>

<script>
    import ct from '../mixins/ct';

    export default {
        mixins: [ct],
        data() {
            return {
                bigText:{
                    maxHeight: 300,
                    minHeight: 50
                },

                datePop: false,
                typePop: false,

                minDate: new Date(1990, 1, 1),
                maxDate: new Date(2019, 10, 1),
                currentDate: new Date(),
                types: [
                    {
                        text:  '厅长信箱',
                        value: '3'
                    },
                    {
                        text:  '电子信访',
                        value: '4'
                    },
                     {
                        text:  '举报信箱',
                        value: '5'
                    },
                     {
                        text:  '在线咨询',
                        value: '6'
                    }],
                type: '',
                form: {
                    report_phone: '',
                    email: '',
                    to_report_enterprise: '',
                    report_type: '',
                    report_time: '',
                    report_title: '',
                    report_person: '',
                    report_content: ''
                },
                user: null
            };
        },
       
        mounted() {

            this.user = JSON.parse(localStorage.getItem("user"));

            this.form.report_time =  this.$date(new Date(), 'yyyy-MM-dd hh:mm:ss')
           
        },
        methods: {

            showType() {
                this.typePop = true;
            },

            showDate () {
                this.datePop = true;
            },
            onDateCancel () {
                this.datePop = false;
            },
            onDateConfirm (v) {
                let dateStr = this.$date(v, 'yyyy-MM-dd hh:mm:ss')
                this.form.report_time = dateStr;
                this.datePop = false;
            },
            onCancel () {
                this.typePop = false;
            },
            onConfirm (v, index) {
                this.form.report_type = v.value;
                this.type = v.text;
                console.log(this.form.report_type);
                this.typePop = false;
            },
            
            // 提交表单
            sumitItem() {
                console.log('提交');
                // 如果数据太多会比较耗时，故打开了 loading
                this.$loading.open();

                if (this.$$isValidDetail(this.form)) {
                    this.$$sumitItem({
                        county_no: this.user.county_no,
                        customer_id: this.user.customer_id,
                        operator_id: this.user.person_id,
                        operator_name: this.user.person_name,
                        vo: this.form
                    }).then(data => {
                        this.$loading.close();
                        this.form = {};
                        this.type = '';
                        //触发关闭，
                        this.$emit("doActiveFalse",'save');
                      
                    }).catch(e => {
                        console.error(e);

                        this.$loading.close();
                        this.$toast('网络错误');
                    });
                } else {
                    this.$loading.close();
                }
            }
        }
    }
</script>

<style type="scss" scoped>
    img {
        width: 100%;
        height: 200px;
    }
</style>
